<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<!--引入css-->
<head>
    <title th:text="用户部门编辑"></title>
    <th:block th:include="admin/include/head :: head"/>
    <link rel="stylesheet" th:href="@{/resources/awi/plugins/z-tree3.5/css/metro/zTreeStyle.css}">
</head>
<body>
<div id="sysDeptform" class="col-md-12 box">

    <form id="sysDept-form-edit" class="form-horizontal" autocomplete="off" th:object="${sysDept}">
        <input type="hidden" id="id" name="id" th:value="*{id}"/>
        <div class="box-body">
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="deptName" class="col-sm-4 control-label require">部门名称</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="deptName" name="deptName" th:value="*{deptName}"/>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="parentId" class="col-sm-4 control-label">上级部门</label>
                    <div class="col-sm-8">
                        <input type="hidden" id="parentId" name="parentId" th:value="*{parentId}"/>
                        <input type="text" class="form-control" id="parentName" name="parentName" th:value="*{parentName}" onfocus="openTree('zTree')"/>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="leader" class="col-sm-4 control-label">负责人</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="leader" name="leader" th:value="*{leader}"/>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="phone" class="col-sm-4 control-label">联系方式（+86）</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="phone" name="phone" th:value="*{phone}"/>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="status" class="col-sm-4 control-label require">部门状态</label>
                    <div class="col-sm-8">
                        <select th:field="*{status}" th:value="*{status}" name="status" id="status" class="form-control">
                            <option th:selected="*{status == 0}" value="0">正常</option>
                            <option th:selected="*{status == 1}" value="1">禁用</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label for="orderNum" class="col-sm-4 control-label require">排序</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="orderNum" name="orderNum" th:value="*{orderNum}"/>
                    </div>
                </div>
            </div>
        </div>
        <div class="box-footer">
            <button type="button" class="btn btn-info pull-right" onclick="formSave()">提交</button>
        </div>
    </form>
</div>
<!-- ztree -->
<div id="zTree" style="display: none;" class="box">
    <div style="padding: 10px; height:90%;" class="box">
        <ul id="typeTree" class="ztree"></ul>
    </div>
</div>
<!--引入js-->
<div th:replace="admin/include/footer :: foot"></div>
<script th:src="@{/resources/awi/plugins/z-tree3.5/js/jquery.ztree.all-3.5.js}"></script>
<script th:src="@{/resources/common/crud.js}"></script>

<script type="text/javascript" th:inline="javascript">
    initTree("/admin/sysDept/zTreeNodes", "typeTree", 0, "parentName", "parentId" ,null);
    initValidator();

    function formSave() {
        var bootstrapValidator = $('#sysDept-form-edit').data('bootstrapValidator').validate();
        if (bootstrapValidator.isValid()) {
            save('/admin/sysDept/update', 'sysDept-form-edit')
        }else {
            layer.msg("请填写所有必填项");
        }
    }

    function initValidator() {
        $('#sysDept-form-edit').bootstrapValidator({
            message: '输入值不满足要求',
            excluded: [':disabled', ':hidden'],
            verbose: false,//verbose为false表示一个字段的多个验证规则中，如果有一个验证不通过则继续去验证其他的字段 在0.5.2版本生效
            fields: {
                deptName: {
                    validators: {
                        notEmpty: {
                            message: '必填'
                        },
                        stringLength: {
                            min: 1,
                            max: 20,
                            message: '不能少于1个或超过20个字符'
                        }
                    }
                },
                leader: {
                    validators: {
                        stringLength: {
                            min: 1,
                            max: 20,
                            message: '不能少于1个或超过20个字符'
                        }
                    }
                },
                phone: {
                    validators: {
                        stringLength: {
                            min: 1,
                            max: 11,
                            message: '不能少于1个或超过11个字符'
                        },
                        regexp: {
                            regexp: /^0?(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
                            message: '请输入正确的手机号'
                        }
                    }
                },
                status: {
                    validators: {
                        notEmpty: {
                            message: '必填'
                        }
                    }
                },
                orderNum: {
                    validators: {
                        notEmpty: {
                            message: '必填'
                        },
                        stringLength: {
                            min: 1,
                            max: 11,
                            message: '不能少于1个或超过11个字符'
                        },
                        regexp: {
                            regexp: /^[0-9]+$/,
                            message: '只能是数字'
                        }
                    }
                },
            }
        });
    }
</script>

</body>
</html>
